<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
  .buy60s_box li a:hover, .index-slide a:hover {
    text-decoration: none;
  }

  body {
    background: #f5f5f5;
  }

  #wrapper, .hd_nav .hd_nav_bd, .header .hd_main, .main_cate, .top_bar .top_bar_bd {
    width: 1200px;
  }
  .cle:after, .clear {
    font-size: 0;
    clear: both;
  }

  a, html {
    color: #605046;
  }

  .btn, .graybtn, button {
    cursor: pointer;
  }

  .btn, .graybtn, .pagenav a {
    border-radius: 2px;
  }

  html {
    background: #fafafa;
     _background-attachment: fixed;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: 0;
  }

  html.isPhone {
    min-width: 1200px;
  }

  blockquote, body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, select, td, textarea, th, ul, figure {
    margin: 0;
    padding: 0;
  }

  body, button, input, select, textarea {
    font: 12px/1.5 "Microsoft YaHei",Tahoma,Helvetica,Arial,simsun;
  }

  .iconfont, address, cite, dfn, em, i, var {
    font-style: normal;
  }

  ol, ul {
    list-style: none;
  }

  fieldset, img {
    border: 0;
  }

  h1 {
    font-size: 18px;
  }

  h2, h3 {
    font-size: 14px;
    font-weight: 700;
  }

  .iconfont, h3, h4, h5 {
    font-weight: 400;
  }

  h4, h5 {
    font-size: 12px;
  }

  button, input, select, textarea {
    font-size: 12px;
    outline: 0;
    resize: none;
    color: #34495e;
  }

  iframe {
    display: none;
  }

  .cle:after, iframe.datepicker, iframe.follow_lizi, iframe.ke-edit-iframe, iframe.login_popup, iframe.twocode {
    display: block;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  .clear {
    height: 0;
    line-height: 0;
    overflow: hidden;
  }

  .cle:after {
    visibility: hidden;
    content: '\20';
    height: 0;
  }

  .cle {
  +zoom:1;
  }

  .fl {
    float: left;
  }

  .fr {
    float: right;
  }

  .tl {
    text-align: left;
  }

  .tc {
    text-align: center;
  }

  .tr {
    text-align: right;
  }

  a {
    text-decoration: none;
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -o-transition: color .2s;
    -ms-transition: color .2s;
    transition: color .2s;
  }

  a:hover {
    text-decoration: underline;
    color: #b0352f;
  }

  .top_bar li a:hover, .top_bar li s {
    text-decoration: none;
  }

  a:focus, area:focus {
    outline: 0;
  }

  ::selection {
    background: #b0352f;
    color: #fff;
  }

  canvas {
    -ms-touch-action: double-tap-zoom;
  }

  .red, a.red, a.red:hover {
    color: red;
  }

  .gray, a.gray, a.gray:hover {
    color: #9e9e9e;
  }

  .green, a.green, a.green:hover {
    color: #2b9b2d;
  }

  .blue, a.blue, a.blue:hover {
    color: #09f;
  }

  .orange, a.orange, a.orange:hover {
    color: #b0352f;
  }


  .iconfont {
    font-family: lizi;
    font-size: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }



  #wrapper {
    width: 1200px;
    margin: 10px auto 80px;
  }

  .top_bar {
    height: 26px;
    background-color: #f0f0f0;
    position: relative;
    z-index: 2002;
  }

  .top_bar .top_bar_bd {
    width: 1200px;
    margin: 0 auto;
    padding-top: 1px;
  }

  .top_bar .bar_fl {
    float: left;
  }

  .top_bar .iconfont {
    color: #999;
    margin-right: 3px;
  }

  .top_bar .bar_fr {
    float: right;
    padding-right: 10px;
  }

  .top_bar li {
    float: left;
    position: relative;
    z-index: 2000;
    height: 18px;
    line-height: 18px;
    padding: 3px 0 3px 18px;
  }

  .top_bar li s {
    border-right: 1px solid #d4d4d4;
    margin: 0 8px;
  }

  .top_bar li a {
    color: #9e9e9e;
  }

  .top_bar li.more_menu {
    padding-right: 18px;
  }

  .top_bar li.more_menu i.arrow {
    position: absolute;
    top: 4px;
    right: 0;
    font-size: 16px;
    line-height: 16px;
    z-index: 2002;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    transition: all .5s;
    color: #bbb;
    margin: 0;
  }

  .top_bar li.more_menu .more_bd {
    position: absolute;
    top: 33px;
    right: 3px;
    z-index: 2000;
    opacity: 0;
    visibility: hidden;
    box-shadow: 1px 1px 3px rgba(100,100,100,.3);
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    transition: all .4s;
  }

  .top_bar .more_bd .list {
    width: 94px;
    border: 1px solid #ddd;
    background: #fff;
  }

  .top_bar .more_bd .hezuo_list {
    width: 72px;
  }

  .top_bar .more_bd .list a {
    display: block;
    background-color: #fff;
    border-bottom: 1px dashed #d7d7d7;
    padding: 6px 10px;
    height: 18px;
    overflow: hidden;
  }

  .top_bar .more_bd .list a:hover {
    background: #f8f8f8;
    color: #333;
    text-decoration: none;
  }

  .top_bar .more_bd .list a.last {
    border-bottom: none;
  }

  .top_bar li.hover i.arrow {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  .top_bar li.hover .more_bd {
    top: 24px;
    opacity: 1;
    visibility: visible;
  }

  .top_bar li.more_menu em.cartnum {
    margin: 0 2px;
    color: #b0352f;
  }

  .header_cart_data {
    background-color: #fff;
    width: 228px;
    border: 1px solid #ddd;
  }

  .header_cart_data dl {
    padding: 5px 8px;
    width: 212px;
    height: 52px;
    overflow: hidden;
    background: #fff;
    border-bottom: 1px dashed #eee;
  }

  .header_cart_data dt {
    float: left;
    width: 52px;
  }

  .header_cart_data dt img {
    width: 50px;
    height: 50px;
    vertical-align: top;
    border: 1px solid #eee;
  }

  .header_cart_data dd {
    float: right;
    width: 150px;
    overflow: hidden;
    color: #666;
    position: relative;
  }

  .header_cart_data dd a:hover {
    text-decoration: underline;
  }

  #footer_my .fsm a:hover, #footer_my .ft_txt .beian_ico a:hover, .btn:hover, .graybtn:hover, .pagenav a:hover {
    text-decoration: none;
  }

  .header_cart_data dd h4 {
    height: 32px;
    overflow: hidden;
    line-height: 16px;
    margin-bottom: 3px;
  }

  .header_cart_data dd i {
    display: inline-block;
    font-size: 10px;
    -webkit-transform: scale(.7);
  }

  #footer_my .fsm, .header_cart_data .fd .fr strong {
    font-size: 14px;
  }

  .header_cart_data dd .del {
    position: absolute;
    top: 34px;
    right: 0;
    color: #bbb;
  }

  .header_cart_data .fd {
    background-color: #f8f8f8;
    padding: 10px 8px;
  }

  .header_cart_data .fd .fl {
    padding-top: 3px;
  }

  .header_cart_data .fd .fr {
    padding: 0 8px;
  }

  #header_cart .more_bd .error_msg {
    padding: 20px;
    background-color: #fff;
    text-align: center;
    color: #999;
  }

  #header_guanzhu .more_bd {
  +visibility:visible;
  +display:none;
  }

  #header_guanzhu .more_bd .list {
    padding: 15px;
    width: 130px;
    height: 160px;


  }

  #header_guanzhu .more_bd .list p {
    padding-left: 31px;
    height: 24px;
    overflow: hidden;
  }
  #header_app .more_bd .list {
    padding: 15px;
    width: 130px;
    height: 160px;

    background: url("http://imgcon.tea7.com/6364772156929060164803935.jpg")  center 20px no-repeat #fff;

  }
  #header_app:hover i.arrow {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  #header_app:hover .more_bd {
    top: 24px;
    opacity: 1;
    visibility: visible;
  }
  .btn, .graybtn {
    overflow: visible;
  }

  #header_guanzhu.hover .more_bd {
  +display:block;
  }

  #footer_my {
    border-top: 1px solid #efefef;
    background-color: #fff;
    padding: 30px 0;
  }

  #footer_my a {
    color: #838383;
  }

  #footer_my .ft_main {
    width: 1200px;
    margin: 0 auto;
    color: #838383;
    position: relative;
  }

  #header_my .ft_nav {
    height: 22px;
  }

  #header_my .ft_nav cite {
    color: #838383;
    margin: 0 3px;
  }

  #header_my .ft_txt p {
    padding: 5px 0;
  }

  #header_my .ft_txt .ft_contact span {
    margin-right: 10px;
  }

  #header_my .ft_txt .beian_ico {
    padding-top: 20px;
  }

  #header_my .ft_txt .beian_ico a {
    margin-right: 15px;
  }

  #header_my .ft_txt .beian_ico img {
    width: 108px;
    height: 40px;
    vertical-align: top;
    border-radius: 2px;
  }

  .btn, .graybtn {
    margin: 0;
    height: 30px;
  }

  #header_my .fsm {
    position: absolute;
    right: 40px;
    top: 10px;
    width: 140px;
    text-align: center;
  }

  #header_my .fsm i {
    font-size: 20px;
    vertical-align: top;
    line-height: 1;
  }

  .btn, .graybtn {
    line-height: 30px;
  }

  .btn, .graybtn, .pagenav, .pagenav a {
    font-size: 14px;
  }

  #header_my .fsm2 {
    right: 240px;
  }

  .tongji-js {
    display: none;
  }

  .btn, .graybtn {
    display: inline-block;
  }

  .pagenav {
    padding: 10px 0;
    text-align: right;
  }

  .pagenav a {
    margin-left: 4px;
    padding: 4px 10px;
    border: 1px solid #ddd;
    background-color: #fff;
  }

  .pagenav a:hover {
    color: #b0352f;
    border-color: #b0352f;
  }

  .pagenav span.current-page {
    padding: 4px 8px;
    margin-left: 3px;
    font-weight: 700;
  }
  .pagenav span.page-cur a {
    border: 0px;
    padding: 4px 8px;
    margin-left: 3px;
    font-weight: 700;
  }

  .btn, .graybtn {
    padding: 0 18px;
  }

  .pagenav span.step {
    color: #999;
    margin: 0 5px;
  }

  .btn {
    color: #fff;
    background-color: #b0352f;
    border: 1px solid #b0352f;
  }

  .btn:hover {
    color: #fff;
    background: #bd5752;
    border-color:#bd5752;
  }

  .btn img {
    vertical-align: middle;
  }

  .graybtn {
    color: #666;
    background-color: #f5f5f5;
    border: 1px solid #dedede;
  }

  .graybtn:hover {
    color: #666;
    background-color: #eee;
  }

  .greenbtn {
    color: #fff;
    background-color: #86ce30;
    border: 1px solid #86ce30;
  }

  .greenbtn:hover {
    color: #fff;
    background-color: #7ec32c;
    border: 1px solid #7ec32c;
  }

  .btn_ffb72c {
    color: #fff;
    background-color: #ffb72c;
    border: 1px solid #ffb72c;
  }

  .btn_ffb72c:hover {
    color: #fff;
    background-color: #f0ac28;
    border: 1px solid #f0ac28;
  }

  input.text, select, textarea {
    border: 1px solid #ddd;
    border-top-color: #ccc;
    box-shadow: 0 1px 3px rgba(200,200,200,.3)inset;
  }

  input.text {
    padding: 7px 8px;
    height: 16px;
    overflow: hidden;
  }

  input.text330{
    width:330px;
  }

  select {
    padding: 6px 4px;
  }

  textarea {
    padding: 8px;
  }

  textarea.ke-edit-textarea {
    box-shadow: none;
  }

  .field-validation-error {
    color:#fe655c;
    margin-left:10px;
  }

  .clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
  .clearfix:before,.clearfix:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0}
  .clearfix:after{clear:both}
  .clearfix{zoom:1}

  .fs12 { font-size:12px; }
  .fs14 { font-size:14px; }
  .fs16 { font-size:16px; }
  .fs18 { font-size:18px; }
  .fs20 { font-size:20px; }
  .fs24 { font-size:24px; }

  .search-selected {
    padding: 0 0 9px;
  }


  .para-title {
    display: block;
    clear: both;
    zoom: 1;
    overflow: hidden;
    border-left: 12px solid #b0352f;
    line-height: 24px;
    font-size: 18px;
    font-weight: 400;
    margin: 35px 0 15px -15px;
    position: relative;
    text-indent:0!important;
   }

  .title-text {
    float: left;
    display: block;
    padding: 0 8px 0 18px;
    line-height: 24px;
    font-size: 18px;
    font-weight: 800;
    font-family: Microsoft YaHei,SimHei,Verdana; background:#fff;
  }
  /*����*/
  .sold_out {
    position: absolute;
    width: 90px;
    height: 90px;
    top: 50%;
    margin-top: -95px;
    left: 50%;
    margin-left: -45px;
     z-index:99;
  }




  /*��¼����*/
  .login_pop {position:fixed; top: 0;width: 100%; height: 100%; background: rgba(0,0,0,0.8); margin: 0 auto; z-index: 99999; display: none;}
  .login_pop .login_pop_bd {
    position:absolute;
    top: 50%;
    margin-top: -220px;
    width: 600px;
    left: 50%;
    margin-left: -300px;
  }
  .login_pop .login_meng_pop {
    position: relative;
    width:90%;
    border-radius: 5px;
    overflow: hidden;
    margin: 0 auto;
    background: #fff; padding: 5px 15px; box-sizing:border-box;
  }
  .login_pop .login_meng_pop .close {
    position: absolute;
    right:15px;
    top: -10px;
    background: #000;
    color: #fff;
    padding: 20px 10px 8px;
    border-radius: 10px;
    font-size:25px;
  }
  .login_pop .login_meng_pop .title {text-align: left; padding-top:15px;}
  .login_pop .login_meng_pop .title b {font-size: 25px;}
  .login_pop .login_meng_pop .title p {font-size:14px;}
  .login_pop .login_meng_pop .action {
    background: #ededed;
    border-radius: 0 0 5px 5px;
    padding: 10px 10px 10px;
    display: -webkit-box; margin:20px -15px -5px;
  }
  .login_pop .gbtn { text-align:center;
    -webkit-box-flex: 1;
    background: #b6b6b6;
    display: block;
    font-size:16px;
    color: #fff;
    margin: 5px;
    border-radius: 10px;
    box-shadow: 0px 4px 0px #747474;
    padding: 15px 0;
  }
  .login_pop .rbtn { text-align:center;
    -webkit-box-flex: 1;
    background: #b0352f;
    display: block;
    font-size:16px;
    color: #fff;
    margin: 5px;
    border-radius: 10px;
    box-shadow: 0px 4px 0px #8f3631;
    padding: 15px 0;
  }

  .input-container {position: relative; width: 100%; height:44px; line-height:44px; overflow: hidden; margin-top:20px; background-color: #fff; border-radius: 3px; -webkit-box-shadow: 0 0 0 1px #d7d7d7; box-shadow: 0 0 0 1px #d7d7d7; -moz-box-sizing: border-box; box-sizing: border-box;}
  .input-container input { border-radius: 0; border: none; display: inline-block; -moz-box-sizing: border-box; box-sizing: border-box;font-size: 16px;}
  .input-error { -webkit-box-shadow: 0 0 0 1px #f23030; box-shadow: 0 0 0 1px #f23030;}
  .acc-input { width: 100%; height: 100%; padding: 0 10px;}
  .code-box { position:absolute; width:160px; height:44px; right: 0; top:0; border-left: 1px solid #d7d7d7;}
  .input-icon { width:25px; height: 25px; line-height:25px; overflow: hidden; position: absolute; font-size:25px; color:#ededed;}
  .code-box+.icon-clear { right:175px;}
  .icon-clear {top:10px;right:10px;background-position: 0 0;}
  .icon-clear { display: none;}
  .input-box { position: relative;}
  .mesg-disable {background-color: #eee;color: #848689;border-radius: 2px; -webkit-box-shadow: 0 0 0 1px #eee; box-shadow: 0 0 0 1px #eee;}
  .mesg-code { position: absolute; width: 160px; height:42px; line-height:44px; right:1px; top:1px; background-color: #fff; color: #f23030; font-size:16px; border: none; outline: 0;border-radius: 2px; -webkit-box-shadow: 0 0 0 1px #f23030; box-shadow: 0 0 0 1px #f23030;}
  .mesg-disable { background-color: #eee; color: #848689;  border-radius: 2px;  -webkit-box-shadow: 0 0 0 1px #eee;  box-shadow: 0 0 0 1px #eee;}
  .notice { font-size:14px; line-height:18px; margin-top:10px; color: #f23030; min-height:30px;}
  .reg_btn { border-radius:3px; margin-top:25px; font-size:16px;}
  .reg-notice { font-size:12px; margin-top:10px;}
  .reg-notice a { color:#b0352f; text-decoration:underline;}
  .btn-noactive { background:#eee; color: #848689;}
  .quick-nav { margin-top:25px;}
  .quick-nav a:first-child {float: left;}
  .quick-nav a:last-child { float: right; }


  /*�ύ���ݺ��load*/
  .date_load {position: absolute; top:0;width: 100%; height: 100%; z-index: 99999; display: none; z-index:100000;}
  .date_load span {background:#fff; display:block; width:120px; position:absolute; left:50%; margin-left:-60px; top:50%; margin-top:-60px; border-radius:15px; padding-bottom:10px;box-shadow: 0px 0px 15px rgba(0,0,0,0.3);}
  .date_load span img {width:90px; height:90px; display: block;margin: 0 auto;}
  .date_load span b { display: block; text-align: center;}


  /*��ɫ��ʾ��*/

  .pay_other_tip {
    display: block;
    width: 100%;
    margin-bottom: 20px;
    background-color: #fffcef;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid #ffbb76;
    font-size: 14px;

  }

  .angularContent {
    display:none;
  }

  /*PC�渡����ʾ��*/
  .test_site.pc { background: #fefcee;border: 1px solid #f3d995; padding:10px 60px; position:fixed; bottom:64px; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); z-index:999999999; border-radius:30px; font-size:14px;}
  .test_site a { padding-right:8px; position:relative;color: #df9c1f;}
  .test_site a:before { content: ""; position: absolute; right:0px; top:11px; width:6px; height:6px; border-left: 1px solid currentColor; border-top: 1px solid currentColor; transform: translate3d(0,-50%,0) rotateZ(135deg); -webkit-transform: translate3d(0,-50%,0) rotateZ(135deg);}
</style>
